What needs to be done to allow a JS file stored in the DAM to be referenced in a script call in an HTML page?

Avatar

Avatar
Level 1
philbps
Level 1

Likes

0 likes

Total Posts

1 post

Correct reply

0 solutions
View profile

Avatar
Level 1
philbps
Level 1

Likes

0 likes

Total Posts

1 post

Correct reply

0 solutions
View profile
philbps
Level 1

23-04-2021

We have a JS file that is stored in the dam. We have an page template that calls that file like this <script type="text/javascript" src="/content/dam/path/to/script/file.js"></script>.

 

When I run the app locally I get this error "The resource from “http://localhost:4502/content/dam/path/to/script/file.js” was blocked due to MIME type (“text/html”) mismatch (X-Content-Type-Options: nosniff).

 

This works in production but I've got no idea how this was achieved.

This is on AEM 6.1.

Accepted Solutions (1)

Accepted Solutions (1)

Avatar

Avatar
Boost 500
MVP
Vijayalakshmi_S
MVP

Likes

573 likes

Total Posts

728 posts

Correct reply

240 solutions
Top badges earned
Boost 500
Give Back 50
Give Back 5
Ignite 10
Ignite 5
View profile

Avatar
Boost 500
MVP
Vijayalakshmi_S
MVP

Likes

573 likes

Total Posts

728 posts

Correct reply

240 solutions
Top badges earned
Boost 500
Give Back 50
Give Back 5
Ignite 10
Ignite 5
View profile
Vijayalakshmi_S
MVP

26-04-2021

Hi @philbps,

Root cause given the error statement is that, request to JS from DAM has Response headers with Content-Type as text/html (deteted as html instead of as JS file) instead of as application/javascript.

X-Content-Type-Options set as nosniff will block the request if the request destination is of type "script" and the MIME type is not a JavaScript MIME type.

With this reason, few possible routes to narrow down the issue(as the issue is only with your local and not in PROD)

  • Compare the network calls (filter requests to "JS") in both local and PROD in same browser. (two different tab)
    • X-Content-Type-Options:nosniff on Response Headers in both local and PROD
  • Confirm if the JS file that you are checking is same in both local and PROD.
    • Can cross verify the asset "Properties" from being in DAM. In particular, "Type" property
  • Look for OSGI configuration related to MIME type in both local and PROD. There exist a config named "Day CQ DAM Mime Type Service" in 6.5.0. Not sure of its equivalent from 6.1 (Should be available in the same name. Else, do search for MIME type and locate the one related to DAM)

Vijayalakshmi_S_0-1619445587330.png

Answers (1)

Answers (1)

Avatar

Avatar
Applaud 25
Level 10
asutosh_jena
Level 10

Likes

593 likes

Total Posts

705 posts

Correct reply

207 solutions
Top badges earned
Applaud 25
Give Back 100
Boost 500
Affirm 100
Ignite 1
View profile

Avatar
Applaud 25
Level 10
asutosh_jena
Level 10

Likes

593 likes

Total Posts

705 posts

Correct reply

207 solutions
Top badges earned
Applaud 25
Give Back 100
Boost 500
Affirm 100
Ignite 1
View profile
asutosh_jena
Level 10

23-04-2021

Hi @philbps 

 

I have done the similar implementation and reading the file path from page properties and showing it on page.

Using the below code:

 

<script data-sly-test.javaScript="${inheritedPageProperties.javaScript}" type="text/javascript" src="${javaScript}"></script>

Thanks!