Closed a0937027831 closed 1 year ago
Facing same issue in react js
I ran into the same problem as you in video.js 8.x
video.js version 7.21.3 videojs-ima version 2.1.0 =>can use
Hello @a0937027831 ,
In your sample I do not see a call loading in the IMA SDK:
<script src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
This is still required when using ES6 imports for the videoJS-IMA plugin.
In addition, I am not familiar with https://codesandbox.io/, but I did not see the various dependencies downloaded anywhere being used in the sample:
import videojs from 'video.js';
import 'videojs-contrib-ads';
import 'videojs-ima';
// Styles
import 'video.js/dist/video-js.min.css';
import 'videojs-contrib-ads/dist/videojs-contrib-ads.css';
import 'videojs-ima/src/css/videojs.ima.css';
Let me know if you have any additional questions.
Thank you, Jackson IMA SDK team
Hi @Kiro705 ,Thanks for your reply
I add this script in head
<script src="//imasdk.googleapis.com/js/sdkloader/ima3.js"></script>
but also show videojs.ima is not a function
start point
onMounted(() => { player = videojs("video", videoOptions, onReady); });
function onReady() { var adsOptions = { debug: true, id: "video", adTagUrl: "http://pubads.g.doubleclick.net/gampad/ads?sz=640x480&iu=/124319096/external/ad_rule_samples&ciu_szs=300x250&ad_rule=1&impl=s&gdfp_req=1&env=vp&output=xml_vmap1&unviewed_position_start=1&cust_params=sample_ar%3Dpremidpostpod%26deployment%3Dgmf-js&cmsid=496&vid=short_onecue&correlator=", }; player.ima(adsOptions); }
this my example github 1.npm install 2.npm run dev 3.open chrome http://localhost:3000/
Hello @a0937027831 ,
Thank you for sharing the sample, I was able to reproduce the issue with the Uncaught TypeError: player.ima is not a function
error.
I think this might be an issue with somehow Nuxt not supporting how the videojs-ima plugin is set up. When testing, I see a request to http://localhost:63112/_nuxt/node_modules/.vite/deps/videojs-ima.js?t=1679412490332&v=3e4b2345
which seems to be a re-compiled version of the videojs-ima plugin files. This file is getting run, but does not seem to successfully register the plugin with video.js. I also do not see an explicit call to import videojs from 'video.js';
in the file which might be the reason why.
I am not very familiar with Nuxt and cannot confirm if it supports this plugin. If you create a different sample that does not use Nuxt, does the issue still happen?
Thank you, Jackson IMA SDK team
Hi @Kiro705 ,Thanks for your reply I can comprises this version to success play ads "dependencies":{ "video.js": "^7.21.3", "videojs-contrib-ads": "^6.9.0", "videojs-ima": "^2.1.0" } I got the test result :
this is my successed example project successed github onlineEditor
This is a peer dependencies issue that will arise if you're installing and using this as a module.
The videojs version in peerDependencies is capped at 7 "video.js": "^5.19.2 || ^6 || ^7"
so yarn/npm will install version 7 for the videojs-ima module. That version is what will get the ima plugin attached but it won't be the version or instance of videojs that gets included in your source file that you use to create a player. You can see this if you use version 8 and videojs-contrib-ads in your package.json and install videojs-ima yarn will install videojs and videojs-contrib-ads under node_modules/videojs-ima/node_modules
Until this package gets updated you can force it to use the updated installed versions by adding the following to your package.json:
"resolutions": {
"videojs-contrib-ads": "^7.1.0",
"video.js": "^8.0.4"
}
Once you do this you shouldn't see the child packages installed under node_modules/videojs-ima/node_modules
@adiffmike,Thanks for your reply
I succeeded to play ima,no error!
I add this:
"overrides": { "videojs-contrib-ads": "^7.1.0", "video.js": "^8.0.4" }
@adiffmike @Kiro705 Thanks for your help!!
###
Expected behaviour play adsActual behaviour
this.player.ima is not a function
Steps to reproduce
1.open cmd 2.npx nuxi init videojs_ima 3.npm i video.js、npm i videojs-contrib-ads、npm i videojs-ima
Environment
Console errors (if any)
this.player.ima is not a function
Link to where the bug is happening
editor online