Загрузка пользовательского файла в jquery возвращает ошибку, даже если файл загружен правильно
Последние браузеры предоставляют более чистый метод расширения Object.prototype. Этот код сделает свойство скрытым от перечисления свойств (для p in o)
. Для браузеров , реализующих defineProperty , вы можете реализовать свойство uniqueId следующим образом:
(function() {
var id_counter = 1;
Object.defineProperty(Object.prototype, "__uniqueId", {
writable: true
});
Object.defineProperty(Object.prototype, "uniqueId", {
get: function() {
if (this.__uniqueId == undefined)
this.__uniqueId = id_counter++;
return this.__uniqueId;
}
});
}());
Подробнее см. в https://developer.mozilla.org/en/JavaScript/Reference/Global_Objects/Object/defineProperty
1 ответ
$.getScript загружает скрипты JavaScript. В отличие от внутренних сценариев, сценариев, где содержимое находится внутри HTML, нельзя использовать внешний сценарий для загрузки чего-либо, кроме JavaScript.
Чтобы загрузить текстовый файл современным простым способом, используйте fetch и async / await
async function main() {
const vertexShader = await fetch("path/to/file/vertexShader.glsl").then(req => req.text());
...
}
main();
или, конечно, превратите его в функцию
async function main() {
const vertexShader = await loadText("path/to/file/vertexShader.glsl");
...
}
function loadText(url) {
return fetch("path/to/file/vertexShader.glsl").then(req => req.text());
}
main();
или без async / await [ 1118]
fetch("path/to/file/vertexShader.glsl")
.then(req => req.text())
.then(function( vertexShader ) {
console.log(vertexShader);
});
или если вы хотите, чтобы это выглядело как getScript
getTextFile("path/to/file/vertexShader.glsl", function( vertexShader ) {
console.log(vertexShader);
});
function getTextFile(url, callback) {
fetch("path/to/file/vertexShader.glsl")
.then(req => req.text())
.then(callback);
}
, где сказано, что если бы я и я хотел, чтобы мои шейдеры были внешними, я бы использовал import ] / export как в
// myvertexshader.glsl
default export `
attribute vec4 position
void main() {
gl_Position = position;
}
`;
И тогда вы можете import сделать это в другом модуле javascript, как в
// main.js
import vertexShader from './myvertexshader.glsl';
...
main.js, который должен быть включен как модуль [ 1122]
<script src="main.js" type="module"></script>
import работает только в современных браузерах (например, в тех, которые запускают WebGL2), но вы можете использовать что-то вроде накопительного пакета , чтобы преобразовать его обратно в старый файл JavaScript в одном стиле.
Это имеет то преимущество, что во время разработки все ваши файлы являются отдельными, но для производства / развертывания вы можете собрать свой JavaScript в один большой файл, который будет загружаться намного быстрее, чем многие маленькие файлы
three.js делает это , если вы хотите увидеть пример