ankidroid / Anki-Android

AnkiDroid: Anki flashcards on Android. Your secret trick to achieve superhuman information retention.
GNU General Public License v3.0
8.19k stars 2.17k forks source link

[Bug] load __viewer__.html failed #7943

Closed donglu closed 3 years ago

donglu commented 3 years ago
Reproduction Steps
  1. go into deck
  2. notify me load viewer.html failed
Expected Result
Actual Result
Debug info

Refer to the support page if you are unsure where to get the "debug info". AnkiDroid Version = 2.14.2

Android Version = 11

ACRA UUID = c4c1652b-c31a-470a-8b27-c7465153e9d7

Scheduler = std

Crash Reports Enabled = true

Research

Enter an [x] character to confirm the points below:

mikehardy commented 3 years ago

Hi there! Could you please edit this report and include the 'Debug info' as requested? The reproduction steps are not very clear to me, is there any way you could make sure you are reproducing either on current stable (2.14.2) or current alpha (2.15alpha18 as I type this, I think) Can you include a video capture of the screen reproducing the problem so we could see it?

Thank you!

donglu commented 3 years ago

bug video : https://wws.lanzous.com/iCTy5jwr9he


Edit by @david-allison-1

https://user-images.githubusercontent.com/62114487/103435594-acf32f80-4c08-11eb-9ee2-99cb7de19e88.mp4

david-allison commented 3 years ago

Hi @donglu, in future, you can upload .zip or .mp4 files directly to GitHub. I've added this to your comment

david-allison commented 3 years ago

One of your cards, or your card template is referencing a file which does not exist in collection.media.

You will need to edit the card template and remove a reference to this file if things are working correctly, or add this file to collection.media if you are having issues.

hea7enn commented 3 years ago

The same problem as I encountered, when an external html file was introduced into Ankidroid, an error was reported: Failed to load the XXX.html file! Hope it can be resolved

mikehardy commented 3 years ago

@hea7en2 probably the same solution mentioned by David above?

hea7enn commented 3 years ago

@ hea7en2 可能与 David 上面提到的解决方案相同?

This is not the case. My collection.media folder is normal. I now want to include an external html file in my card template. This html file is placed in the collection.media folder, and the html file is normal. Import There was an error: Cannot load the XXX.html file, I don’t know what caused it! Note: The method used is:$("#id").load("_test.html");

krmanik commented 3 years ago

If you are using Anki Desktop then jQuery $ can be used to load data. Because in webview the cards content loaded using localhost. So http://127.0.0.1:.../ On AnkiDesktop, the data.json is in collection.media folder and can be loaded without error.

$.getJSON("data.json", function(json) {
    console.log(json); 
});

But in case of AnkiDroid the webview created with html file viewer .html to load card contents with file:/// protocol. So, if external file get loading using jQuery or fetch in that protocol then you will get following error.

Access to XMLHttpRequest at 'file:///storage/emulated/0/AnkiDroid/collection.media/data.json' from origin 'null' has been 
blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-untrusted, 
https.

You can also debug by turning on HTML/JavaScript Debugging from advanced settings in AnkiDroid.

srghma commented 3 years ago

@infinyte7 is there any way to download json

$.getJSON("data.json", function(json) {
    console.log(json); 
});

on AnkiDroid and overcome this issue

krmanik commented 3 years ago

The only possible solution is using some kind of web server app on Android and loading that content inside AnkiDroid. On StackOverflow there are many questions related to loading json in android webview if you are interested in reading more about this issues. I developed web server app using existing code for practicing Chinese characters. I pasted all the required .json inside the app directory and get request over localhost in AnkiDroid. https://github.com/infinyte7/AndroidWebServer https://github.com/infinyte7/Anki-xiehanzi/wiki/Load-hanzi-data-offline

The other solution is adding json data to js file and loading using script tag. Because script can add js code in html without cors error. But this is useful when data is not immediately needed in deck template. https://github.com/infinyte7/hanzi-writer-data-in-javascript

srghma commented 3 years ago

The other solution is adding json data to js file and loading using script tag

@infinyte7 awesome, didnt think about it

finally it works, can view info of hanzi when I click on characters in sentence

the only problem is that I have do copy dir with js files to my mobile phone myself

https://github.com/srghma/anki-addon-glossary/blob/59e6bf0c76e4a912fe6cadb0d9a5852f05d83b5a/anki-addon-glossary/__init__.py#L80

https://github.com/srghma/anki-cards-from-pdf/blob/f30cd76d5f7adea386de657ef9295e7ea425ba52/anki-templates/ch-hks/script.html

photo5285223885459009773

github-actions[bot] commented 3 years ago

Hello 👋, this issue has been opened for more than 2 months with no activity on it. If the issue is still here, please keep in mind that we need community support and help to fix it! Just comment something like still searching for solutions and if you found one, please open a pull request! You have 7 days until this gets closed automatically