I created a mini website that plays random songs using Spotify. Everything works perfectly fine on desktop browsers - the preview_urls play flawlessly! However, when I try to use my player on an iPhone (iOS), the preview_url doesn't respond and the song won't play. It seems like Safari is having trouble loading the music.
The player was built with howler.js.
Has anyone else experienced this issue with Spotify on iOS/Safari? Any ideas on what could be causing this problem?
Thank you!
If you're dealing with audio on iOS, keep in mind that it will remain locked until a sound is played within a user interaction, such as a 'touchstart' event. The latest version of howler.js (v1.1.22) now has a feature that attempts to automatically unlock the audio. However, depending on your UI setup, it might be beneficial to include an overlay prompting the user to touch the screen before they can use the app and unlock the audio.
For more information on this issue, check out the updated documentation on howler.js: https://github.com/goldfire/howler.js#ios-playback
I'm facing an issue transferring a filename from server/app.js to a controller in client/app/ Currently, I am utilizing Multer for handling file uploads, which is functioning correctly. However, I need to transfer the filename back to the client side ...
I'm still getting the hang of React, so please bear with me if this is a simple issue. My goal is to utilize a JavaScript Object: const gameCardData = { "university": { "elemental-wars": { "imgAlt": "Elemental Wars Start Screen", " ...
I encountered an issue while testing the function below, resulting in the error mentioned above. function toggleRecovery = e => { e.preventDefault() this.setState( { recovery: !this.state.recovery }, () => { ...
I am facing a challenge with a table that contains rows and checkboxes. There is one main checkbox in the header along with multiple checkboxes for each row. I am now searching for a function that can delete rows from the table when a delete button is clic ...
I'm currently working on a for loop that loops through an array consisting of 3 different report numbers. For each value in the array, an AJAX request is sent out. What I want to achieve is having a unique behavior for the .done() function based on th ...
var answer = ""; var correct = "4"; var question = "What is 2 * 2?"; for(i = 2; i < 5; i++) { answer = prompt(question, "0"); if (answer == correct) { alert("Your answer is correct!"); break; } } Before the break command is ...
Trying to educate myself on AJAX using w3schools.com, but struggling with a particular example: xhttp.open("GET", "demo_get.asp", true); xhttp.send(); In the above example, there might be a cached result. To prevent this, you can include a unique ID in t ...
Currently facing a minor issue with my website. I am trying to allow users to customize certain options before checking out, which would impact the final price. While I have successfully implemented this feature, users can easily inspect element and modify ...
After going through numerous discussions on this problem, I realized that none of them truly explains the issue at hand. To resolve the conflicts arising from using facebookSDK with JSON, one effective solution is to alter the names of the JSON classes ca ...
Currently, I am utilizing the OR operator within Typescript to designate that a product could be of type ProductI OR CartResponseInterface.Product This is how it is structured: product: ProductI | CartResponseInterface.Product However, when attempting t ...
Currently, I have a JSON array structured as follows: var data = { report: [ { Name: "Nitin", comment: [ { count: 0, mName: "Feb" }, ...
Is there a more concise and elegant way to achieve the same functionality as my current method? I am looking for a shorter solution to create an array of items that haven't been used in the form previously, which are then used to populate a select dro ...
I've been testing my NodeJS backend with Insomnia and it's working perfectly fine there. However, whenever I try to access the frontend, I keep getting a 500 error. It's puzzling because the endpoint is functioning correctly in the testing p ...
Referencing a tutorial from http://www.w3schools.com/bootstrap/bootstrap_modal.asp: <button type="button" class="btn btn-info btn-lg" data-toggle="modal" data-target="#myModal">Open Modal</button> <div id="myModal" class="modal fade" role= ...
I have a JSON file that I need help creating and sending to a server. As someone who is new to working with JSON, could someone please provide guidance on how to construct this Object? { "today_steps": 5663, "activities": [{ "activity_name": "Walkin ...
I am struggling with headaches trying to integrate an automatically generated JavaScript library into TypeScript... I have packaged the JavaScript library and d.ts file into an npm package, installed the npm package, and the typings modules in the TypeScr ...
In the past, I utilized a method to display tweets from my Twitter account on a feed for my website customers: <ul id="twitter_update_list"><li>Twitter feed loading</li></ul> <script type="text/javascript" src="http://twitter.co ...
I am struggling to organize an array of objects based on a specific key (name). My goal is to have the data with uppercase letters appear first, but for some reason, it's displaying the lowercase data first. I've been using the lodash method "ord ...
Here's the scenario I'm dealing with: In a fun group chat with my friends, I created a giphy bot that responds to /giphy [terms] messages by posting the top result for those terms. However, my friends started abusing it by spamming the chat. To ...
I implemented code to toggle the display of a loading image on my web page while making ajax requests. $(document).ajaxStart(function(){ $("#please_wait").css("display","block"); }); $(document).ajaxComplete(function(){ $("#please_wait").css(" ...