Using Confluence to Access a Unique REST API

I've successfully developed and deployed my own webservice using WCF C#. Now, I'm looking to utilize JavaScript to call this service, retrieve data from it, and display it on a chart.

Below is the code snippet that I placed within a custom HTML macro in confluence:

<script>
function fetchWebServiceData() 
{
    var request = $.ajax({
        url: "http://mydomain:port/MyService.svc/testRest",
        data: "m=aa",
        processData: true,
        type: "GET",
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
             console.log(response);
        },
        error: function (e) {
             console.log('error ' + e.status + ' ' + e.responseText);
         }
      });
 }

 var result = fetchWebServiceData();
 console.log(result);
</script>

Upon inspecting the developer console in Google Chrome (F12), I encountered the following error:

Mixed Content: The page at '' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint ''. This request has been blocked; the content must be served over HTTPS.

I have already added the service URL to the whitelist. If I enable SSL on my domain, would this resolve the issue? Are there alternative solutions?

The end goal is to dynamically populate tables and charts with external data. To achieve this, I began by creating a service that returns JSON data. Once this initial step is successful, I can use the retrieved data to populate a HighCharts component, for instance.

https://i.sstatic.net/UvXn5.png

Answer №1

To solve the issue, simply switch the URL from

http://mydomain:port/MyService.svc/testRest
to
https://mydomain:port/MyService.svc/testRest
. It's important to note that Google Chrome is correct in flagging instances where a page is served through https but calls a service using http. Enabling and actively utilizing SSL will resolve this problem. In fact, it is recommended that all services exclusively use secure channels. It's advisable to make SSL mandatory for your service.

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Using JavaScript to organize and categorize data within an array

I am working with a multidimensional array and need to filter it based on the value at a specific index position. Here is what the array looks like: arr = [ [1 , 101 , 'New post ', 0], [2, 101 , 'New Post' , 1], ...

Tips for recognizing hyperlinks within a block of text and converting them to clickable links in Angular 2

My task is to create clickable links within a paragraph of strings. I tried using a custom pipe, but seem to be missing something essential. Here's my attempt: import { Pipe, PipeTransform } from '@angular/core'; import { DecimalPipe ...

What is the best way to incorporate API calls within a React component's return using a select statement?

Here is the current structure of my component: import React, { useEffect, useState } from "react"; import Table from "../../../../Table/Table"; import { getBalance } from "../../../../../datasource/Financials"; export default ...

Delivering Json Data Effortlessly: PushStreamContent and Handling Large Objects

When trying to stream a large object, I've encountered an issue with sending it in chunks. The code I have posted does work, however, stream.Flush() is only getting called once. This means that the object is being buffered instead of streamed - not id ...

Running npm commands, such as create-react-app, without an internet connection can be a

Currently, I am working in an offline environment without access to the internet. My system has node JS installed. However, whenever I attempt to execute the npm create-react-app command, I encounter an error. Is there a workaround that would allow me to ...

Why is this loop in jQuery executing twice?

$(document).bind("ready", function(){ // Looping through each "construct" tag $('construct').each( alert('running'); function () { // Extracting data var jC2_events = $(this).html().spl ...

CSS-enabled tabs built with React

Currently, I have a setup with 5 divs and 5 buttons where only one div is visible at a time when its corresponding button is clicked. However, I am looking for suggestions on how to improve the efficiency and readability of my code. If you have any best pr ...

Resetting the Buefy datepicker

I am using a beautiful date picker in my project to retrieve the value deliveryDate. The date is displayed with an option to clear it using a button that sets the date to null when clicked. However, I am encountering errors related to prop types in the con ...

Having trouble with your jQuery animation on a div?

Check out this jsFiddle example: http://jsfiddle.net/uM68j/ After clicking on one of the links in the demo, the bar is supposed to smoothly slide to the top. However, instead of animating, it immediately jumps to the top. How can I modify the code to ac ...

Retrieve pairs of items from a given variable

Containing values in my 'getDuplicates' variable look like this: getDuplicates = 100,120,450,490,600,650, ... These represent pairs and ranges: Abegin,Aend,Bbegin,Bend My task is to loop through them in order to apply these ranges. var ge ...

Do you have the complete source code for the ServiceKnownTypeAttribute class?

I'm interested in exploring the source code for the ServiceKnownType attribute with the intention of creating a generic version. I want to start by reviewing the actual source code and making modifications as needed. After checking out the .NET sourc ...

Angular method for monitoring element resizing detection

I'm having trouble with resizing using the UI-Calendar directive for Full Calendar. The div containing the calendar can change size based on an event, which modifies the div's class and therefore its size. However, when this occurs, the calendar ...

Conceal the div by clicking outside of it

Is there a way to conceal the hidden div with the "hidden" class? I'd like for it to slide out when the user clicks outside of the hidden div. HTML <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.c ...

Determine the selected radio button

----EDIT---- I am developing a jQuery mobile application and I need to determine which radio button is selected. This is the JavaScript code I'm using: function filter(){ if(document.getElementById('segment1').checked) { aler ...

Struggling with navigating JSON data in JavaScript and facing difficulties sorting the array

I am currently facing the challenge of organizing data obtained from an API using JavaScript. JavaScript Code to Retrieve Data: function getResults() { var url = $.getJSON("http://api.api.com&leagues=SOCENGPRE&lang=en&format=jsonp&cal ...

Executing a jQuery function only once per click on a select element - how can it be done?

I have a form with a select element, and I want some code to run when I click on it, but not when I choose an option. The issue is that the code is running twice, preventing me from selecting an option as it resets itself each time. Here is the HTML: &l ...

The X axis labels are missing on the Google column chart

Problem: All column charts are rendering correctly in Internet Explorer. However, Upon clicking the "View Build Performances" button, project names are displayed on the x-axis of the first three column charts only. The other column charts do not show pro ...

Iterate using jQuery through all child div elements

<div id="SelectedSection" class="selected"> <div class="sec_ch" name="7"> <div class="sec_ch" name="8"> <div class="sec_ch" name="9"> <div class="sec_ch" name="11"> <div class="clear"> </div> </di ...

Prevent page scrolling when an AngularJS dropdown is active

When using the angularjs dropdown, I encounter an issue where scrolling to the end of each side of the content triggers scrolling of the body, which can be quite bothersome. Is there a way to prevent the body document from scrolling when the dropdown is di ...

Examine the state of each element within a div separately

I have a div containing elements with the class 'container'. Each of these container elements has multiple child divs with the class 'children'. I am looking to perform an action on the child divs when they become visible in the viewpor ...