How to send user credentials safely through JSON

Question

I read few articles about sending request via JSON safely and most of the questions resulted in using https(SSL).

Even if its SSL server, when we send the credentials through ajax, it can be viewed from html source right.(is that a very stupid question? i'm asking because i don't know).

Can someone direct me in the right way, how to send a request to an API securely using JSON.

Below is my sample code for UPS:

<script>
$(document).ready(function() {
    //all variables are assigned before sending, I've trimmed the code
    var formData = { "UPSSecurity": { "UsernameToken": { "Username": "xxxxxx", "Password": "xxxxxx" }, "ServiceAccessToken": { "AccessLicenseNumber": "xxxxxxxxxx" } }, "ShipmentRequest": { "Request": { "RequestOption": "validate", "TransactionReference": { "CustomerContext": "Test" } }, "Shipment": { "Description": "Description", "Shipper": { "Name": "Test Name", "AttentionName": "xxxxxx", "TaxIdentificationNumber": "123456", "Phone": { "Number": "1234567890", "Extension": "1" }, "ShipperNumber": "xxxxxx", "FaxNumber": "1234567890", "Address": { "AddressLine": "2311 York Rd", "City": "Sebastopol", "StateProvinceCode": "CA", "PostalCode": "95473", "CountryCode": "US" } }, "ShipTo": { "Name": to_name, "AttentionName": to_name, "Phone": { "Number": to_Phone }, "Address": { "AddressLine": to_AddressLine, "City": to_City, "StateProvinceCode": to_StateProvinceCode, "PostalCode": to_PostalCode, "CountryCode": to_CountryCode } }, "ShipFrom": { "Name": from_name, "AttentionName": from_name, "Phone": { "Number": from_Phone }, "FaxNumber": "1234567890", "Address": { "AddressLine": from_AddressLine, "City": from_City, "StateProvinceCode": from_StateProvinceCode, "PostalCode": from_PostalCode, "CountryCode": from_CountryCode } }, "PaymentInformation": { "ShipmentCharge": { "Type": "01", "BillShipper": { "AccountNumber": "xxxxxx" } } }, "Service": { "Code": service_code, "Description": service_description }, "Shi8mentRatingOptions": { "NegotiatedRatesIndicator": "0" }, "Package": { "Description": "Description", "Packaging": { "Code": "02", "Description": "Description" }, "Dimensions": { "UnitOfMeasurement": { "Code": "IN", "Description": "Inches" }, "Length": length, "Width": width, "Height": height }, "PackageWeight": { "UnitOfMeasurement": { "Code": "LBS", "Description": "Pounds" }, "Weight": weight } } }, "LabelSpecification": { "LabelImageFormat": { "Code": "GIF", "Description": "GIF" } } } };

    $.ajax({
        type       : "POST",
        url        : "https://wwwcie.ups.com/rest/Ship",
        crossDomain: true,
        timeout    : 240000,
        contentType: 'application/json',
        data       : JSON.stringify(formData),
        dataType   : 'json',
        success    : function(response)
        {
            //process response
        }  
    }); 
}); 
</script>

How can i send such a request safely by protecting my user credentials.

thanks.